<template>
  <el-dialog
    :title="!dataForm.uid ? '新增' : '修改'"
    :close-on-click-modal="false"
    :visible.sync="visible">
    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
    <el-form-item label="logo(文件UID)" prop="logo">
      <el-input v-model="dataForm.logo" placeholder="logo(文件UID)"></el-input>
    </el-form-item>
    <el-form-item label="网站名称" prop="name">
      <el-input v-model="dataForm.name" placeholder="网站名称"></el-input>
    </el-form-item>
    <el-form-item label="介绍" prop="summary">
      <el-input v-model="dataForm.summary" placeholder="介绍"></el-input>
    </el-form-item>
    <el-form-item label="关键字" prop="keyword">
      <el-input v-model="dataForm.keyword" placeholder="关键字"></el-input>
    </el-form-item>
    <el-form-item label="作者" prop="author">
      <el-input v-model="dataForm.author" placeholder="作者"></el-input>
    </el-form-item>
    <el-form-item label="备案号" prop="recordNum">
      <el-input v-model="dataForm.recordNum" placeholder="备案号"></el-input>
    </el-form-item>
    <el-form-item label="状态" prop="status">
      <el-input v-model="dataForm.status" placeholder="状态"></el-input>
    </el-form-item>
    <el-form-item label="创建时间" prop="createTime">
      <el-input v-model="dataForm.createTime" placeholder="创建时间"></el-input>
    </el-form-item>
    <el-form-item label="更新时间" prop="updateTime">
      <el-input v-model="dataForm.updateTime" placeholder="更新时间"></el-input>
    </el-form-item>
    <el-form-item label="标题" prop="title">
      <el-input v-model="dataForm.title" placeholder="标题"></el-input>
    </el-form-item>
    <el-form-item label="支付宝收款码FileId" prop="aliPay">
      <el-input v-model="dataForm.aliPay" placeholder="支付宝收款码FileId"></el-input>
    </el-form-item>
    <el-form-item label="微信收款码FileId" prop="weixinPay">
      <el-input v-model="dataForm.weixinPay" placeholder="微信收款码FileId"></el-input>
    </el-form-item>
    <el-form-item label="github地址" prop="github">
      <el-input v-model="dataForm.github" placeholder="github地址"></el-input>
    </el-form-item>
    <el-form-item label="gitee地址" prop="gitee">
      <el-input v-model="dataForm.gitee" placeholder="gitee地址"></el-input>
    </el-form-item>
    <el-form-item label="QQ号" prop="qqNumber">
      <el-input v-model="dataForm.qqNumber" placeholder="QQ号"></el-input>
    </el-form-item>
    <el-form-item label="QQ群" prop="qqGroup">
      <el-input v-model="dataForm.qqGroup" placeholder="QQ群"></el-input>
    </el-form-item>
    <el-form-item label="微信号" prop="weChat">
      <el-input v-model="dataForm.weChat" placeholder="微信号"></el-input>
    </el-form-item>
    <el-form-item label="邮箱" prop="email">
      <el-input v-model="dataForm.email" placeholder="邮箱"></el-input>
    </el-form-item>
    <el-form-item label="显示的列表（用于控制邮箱、QQ、QQ群、Github、Gitee、微信是否显示在前端）" prop="showList">
      <el-input v-model="dataForm.showList" placeholder="显示的列表（用于控制邮箱、QQ、QQ群、Github、Gitee、微信是否显示在前端）"></el-input>
    </el-form-item>
    <el-form-item label="登录方式列表（用于控制前端登录方式，如账号密码,码云,Github,QQ,微信）" prop="loginTypeList">
      <el-input v-model="dataForm.loginTypeList" placeholder="登录方式列表（用于控制前端登录方式，如账号密码,码云,Github,QQ,微信）"></el-input>
    </el-form-item>
    <el-form-item label="是否开启评论(0:否 1:是)" prop="openComment">
      <el-input v-model="dataForm.openComment" placeholder="是否开启评论(0:否 1:是)"></el-input>
    </el-form-item>
    <el-form-item label="是否开启移动端评论(0:否， 1:是)" prop="openMobileComment">
      <el-input v-model="dataForm.openMobileComment" placeholder="是否开启移动端评论(0:否， 1:是)"></el-input>
    </el-form-item>
    <el-form-item label="是否开启赞赏(0:否， 1:是)" prop="openAdmiration">
      <el-input v-model="dataForm.openAdmiration" placeholder="是否开启赞赏(0:否， 1:是)"></el-input>
    </el-form-item>
    <el-form-item label="是否开启移动端赞赏(0:否， 1:是)" prop="openMobileAdmiration">
      <el-input v-model="dataForm.openMobileAdmiration" placeholder="是否开启移动端赞赏(0:否， 1:是)"></el-input>
    </el-form-item>
    <el-form-item label="是否开启用户创作(0:否， 1:是)" prop="openCreateBlog">
      <el-input v-model="dataForm.openCreateBlog" placeholder="是否开启用户创作(0:否， 1:是)"></el-input>
    </el-form-item>
    <el-form-item label="友链申请模板,添加友链申请模板格式" prop="linkApplyTemplate">
      <el-input v-model="dataForm.linkApplyTemplate" placeholder="友链申请模板,添加友链申请模板格式"></el-input>
    </el-form-item>
    <el-form-item label="是否开启问答 (0:否， 1:是)" prop="openCreateQuestion">
      <el-input v-model="dataForm.openCreateQuestion" placeholder="是否开启问答 (0:否， 1:是)"></el-input>
    </el-form-item>
    <el-form-item label="是否开启加载校验，(0：不开启，1：开启)" prop="openLoadingValid">
      <el-input v-model="dataForm.openLoadingValid" placeholder="是否开启加载校验，(0：不开启，1：开启)"></el-input>
    </el-form-item>
    <el-form-item label="加载校验文本" prop="loadingValidText">
      <el-input v-model="dataForm.loadingValidText" placeholder="加载校验文本"></el-input>
    </el-form-item>
    <el-form-item label="加载校验图uid" prop="loadingValidFileUid">
      <el-input v-model="dataForm.loadingValidFileUid" placeholder="加载校验图uid"></el-input>
    </el-form-item>
    <el-form-item label="支持的聊天类型列表（用于控制 表情、语音、图片、通话、视频 是否显示在前端）" prop="chatTypeList">
      <el-input v-model="dataForm.chatTypeList" placeholder="支持的聊天类型列表（用于控制 表情、语音、图片、通话、视频 是否显示在前端）"></el-input>
    </el-form-item>
    <el-form-item label="是否开启聊天" prop="openChat">
      <el-input v-model="dataForm.openChat" placeholder="是否开启聊天"></el-input>
    </el-form-item>
    <el-form-item label="微信公众号二维码FileUid" prop="wechatFileUid">
      <el-input v-model="dataForm.wechatFileUid" placeholder="微信公众号二维码FileUid"></el-input>
    </el-form-item>
    <el-form-item label="是否删除:0否 1是" prop="isDelete">
      <el-input v-model="dataForm.isDelete" placeholder="是否删除:0否 1是"></el-input>
    </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
  export default {
    data () {
      return {
        visible: false,
        dataForm: {
          uid: 0,
          logo: '',
          name: '',
          summary: '',
          keyword: '',
          author: '',
          recordNum: '',
          status: '',
          createTime: '',
          updateTime: '',
          title: '',
          aliPay: '',
          weixinPay: '',
          github: '',
          gitee: '',
          qqNumber: '',
          qqGroup: '',
          weChat: '',
          email: '',
          showList: '',
          loginTypeList: '',
          openComment: '',
          openMobileComment: '',
          openAdmiration: '',
          openMobileAdmiration: '',
          openCreateBlog: '',
          linkApplyTemplate: '',
          openCreateQuestion: '',
          openLoadingValid: '',
          loadingValidText: '',
          loadingValidFileUid: '',
          chatTypeList: '',
          openChat: '',
          wechatFileUid: '',
          isDelete: ''
        },
        dataRule: {
          logo: [
            { required: true, message: 'logo(文件UID)不能为空', trigger: 'blur' }
          ],
          name: [
            { required: true, message: '网站名称不能为空', trigger: 'blur' }
          ],
          summary: [
            { required: true, message: '介绍不能为空', trigger: 'blur' }
          ],
          keyword: [
            { required: true, message: '关键字不能为空', trigger: 'blur' }
          ],
          author: [
            { required: true, message: '作者不能为空', trigger: 'blur' }
          ],
          recordNum: [
            { required: true, message: '备案号不能为空', trigger: 'blur' }
          ],
          status: [
            { required: true, message: '状态不能为空', trigger: 'blur' }
          ],
          createTime: [
            { required: true, message: '创建时间不能为空', trigger: 'blur' }
          ],
          updateTime: [
            { required: true, message: '更新时间不能为空', trigger: 'blur' }
          ],
          title: [
            { required: true, message: '标题不能为空', trigger: 'blur' }
          ],
          aliPay: [
            { required: true, message: '支付宝收款码FileId不能为空', trigger: 'blur' }
          ],
          weixinPay: [
            { required: true, message: '微信收款码FileId不能为空', trigger: 'blur' }
          ],
          github: [
            { required: true, message: 'github地址不能为空', trigger: 'blur' }
          ],
          gitee: [
            { required: true, message: 'gitee地址不能为空', trigger: 'blur' }
          ],
          qqNumber: [
            { required: true, message: 'QQ号不能为空', trigger: 'blur' }
          ],
          qqGroup: [
            { required: true, message: 'QQ群不能为空', trigger: 'blur' }
          ],
          weChat: [
            { required: true, message: '微信号不能为空', trigger: 'blur' }
          ],
          email: [
            { required: true, message: '邮箱不能为空', trigger: 'blur' }
          ],
          showList: [
            { required: true, message: '显示的列表（用于控制邮箱、QQ、QQ群、Github、Gitee、微信是否显示在前端）不能为空', trigger: 'blur' }
          ],
          loginTypeList: [
            { required: true, message: '登录方式列表（用于控制前端登录方式，如账号密码,码云,Github,QQ,微信）不能为空', trigger: 'blur' }
          ],
          openComment: [
            { required: true, message: '是否开启评论(0:否 1:是)不能为空', trigger: 'blur' }
          ],
          openMobileComment: [
            { required: true, message: '是否开启移动端评论(0:否， 1:是)不能为空', trigger: 'blur' }
          ],
          openAdmiration: [
            { required: true, message: '是否开启赞赏(0:否， 1:是)不能为空', trigger: 'blur' }
          ],
          openMobileAdmiration: [
            { required: true, message: '是否开启移动端赞赏(0:否， 1:是)不能为空', trigger: 'blur' }
          ],
          openCreateBlog: [
            { required: true, message: '是否开启用户创作(0:否， 1:是)不能为空', trigger: 'blur' }
          ],
          linkApplyTemplate: [
            { required: true, message: '友链申请模板,添加友链申请模板格式不能为空', trigger: 'blur' }
          ],
          openCreateQuestion: [
            { required: true, message: '是否开启问答 (0:否， 1:是)不能为空', trigger: 'blur' }
          ],
          openLoadingValid: [
            { required: true, message: '是否开启加载校验，(0：不开启，1：开启)不能为空', trigger: 'blur' }
          ],
          loadingValidText: [
            { required: true, message: '加载校验文本不能为空', trigger: 'blur' }
          ],
          loadingValidFileUid: [
            { required: true, message: '加载校验图uid不能为空', trigger: 'blur' }
          ],
          chatTypeList: [
            { required: true, message: '支持的聊天类型列表（用于控制 表情、语音、图片、通话、视频 是否显示在前端）不能为空', trigger: 'blur' }
          ],
          openChat: [
            { required: true, message: '是否开启聊天不能为空', trigger: 'blur' }
          ],
          wechatFileUid: [
            { required: true, message: '微信公众号二维码FileUid不能为空', trigger: 'blur' }
          ],
          isDelete: [
            { required: true, message: '是否删除:0否 1是不能为空', trigger: 'blur' }
          ]
        }
      }
    },
    methods: {
      init (id) {
        this.dataForm.uid = id || 0
        this.visible = true
        this.$nextTick(() => {
          this.$refs['dataForm'].resetFields()
          if (this.dataForm.uid) {
            this.$http({
              url: this.$http.adornUrl(`/user/webconfig/info/${this.dataForm.uid}`),
              method: 'get',
              params: this.$http.adornParams()
            }).then(({data}) => {
              if (data && data.code === 0) {
                this.dataForm.logo = data.webConfig.logo
                this.dataForm.name = data.webConfig.name
                this.dataForm.summary = data.webConfig.summary
                this.dataForm.keyword = data.webConfig.keyword
                this.dataForm.author = data.webConfig.author
                this.dataForm.recordNum = data.webConfig.recordNum
                this.dataForm.status = data.webConfig.status
                this.dataForm.createTime = data.webConfig.createTime
                this.dataForm.updateTime = data.webConfig.updateTime
                this.dataForm.title = data.webConfig.title
                this.dataForm.aliPay = data.webConfig.aliPay
                this.dataForm.weixinPay = data.webConfig.weixinPay
                this.dataForm.github = data.webConfig.github
                this.dataForm.gitee = data.webConfig.gitee
                this.dataForm.qqNumber = data.webConfig.qqNumber
                this.dataForm.qqGroup = data.webConfig.qqGroup
                this.dataForm.weChat = data.webConfig.weChat
                this.dataForm.email = data.webConfig.email
                this.dataForm.showList = data.webConfig.showList
                this.dataForm.loginTypeList = data.webConfig.loginTypeList
                this.dataForm.openComment = data.webConfig.openComment
                this.dataForm.openMobileComment = data.webConfig.openMobileComment
                this.dataForm.openAdmiration = data.webConfig.openAdmiration
                this.dataForm.openMobileAdmiration = data.webConfig.openMobileAdmiration
                this.dataForm.openCreateBlog = data.webConfig.openCreateBlog
                this.dataForm.linkApplyTemplate = data.webConfig.linkApplyTemplate
                this.dataForm.openCreateQuestion = data.webConfig.openCreateQuestion
                this.dataForm.openLoadingValid = data.webConfig.openLoadingValid
                this.dataForm.loadingValidText = data.webConfig.loadingValidText
                this.dataForm.loadingValidFileUid = data.webConfig.loadingValidFileUid
                this.dataForm.chatTypeList = data.webConfig.chatTypeList
                this.dataForm.openChat = data.webConfig.openChat
                this.dataForm.wechatFileUid = data.webConfig.wechatFileUid
                this.dataForm.isDelete = data.webConfig.isDelete
              }
            })
          }
        })
      },
      // 表单提交
      dataFormSubmit () {
        this.$refs['dataForm'].validate((valid) => {
          if (valid) {
            this.$http({
              url: this.$http.adornUrl(`/user/webconfig/${!this.dataForm.uid ? 'save' : 'update'}`),
              method: 'post',
              data: this.$http.adornData({
                'uid': this.dataForm.uid || undefined,
                'logo': this.dataForm.logo,
                'name': this.dataForm.name,
                'summary': this.dataForm.summary,
                'keyword': this.dataForm.keyword,
                'author': this.dataForm.author,
                'recordNum': this.dataForm.recordNum,
                'status': this.dataForm.status,
                'createTime': this.dataForm.createTime,
                'updateTime': this.dataForm.updateTime,
                'title': this.dataForm.title,
                'aliPay': this.dataForm.aliPay,
                'weixinPay': this.dataForm.weixinPay,
                'github': this.dataForm.github,
                'gitee': this.dataForm.gitee,
                'qqNumber': this.dataForm.qqNumber,
                'qqGroup': this.dataForm.qqGroup,
                'weChat': this.dataForm.weChat,
                'email': this.dataForm.email,
                'showList': this.dataForm.showList,
                'loginTypeList': this.dataForm.loginTypeList,
                'openComment': this.dataForm.openComment,
                'openMobileComment': this.dataForm.openMobileComment,
                'openAdmiration': this.dataForm.openAdmiration,
                'openMobileAdmiration': this.dataForm.openMobileAdmiration,
                'openCreateBlog': this.dataForm.openCreateBlog,
                'linkApplyTemplate': this.dataForm.linkApplyTemplate,
                'openCreateQuestion': this.dataForm.openCreateQuestion,
                'openLoadingValid': this.dataForm.openLoadingValid,
                'loadingValidText': this.dataForm.loadingValidText,
                'loadingValidFileUid': this.dataForm.loadingValidFileUid,
                'chatTypeList': this.dataForm.chatTypeList,
                'openChat': this.dataForm.openChat,
                'wechatFileUid': this.dataForm.wechatFileUid,
                'isDelete': this.dataForm.isDelete
              })
            }).then(({data}) => {
              if (data && data.code === 0) {
                this.$message({
                  message: '操作成功',
                  type: 'success',
                  duration: 1500,
                  onClose: () => {
                    this.visible = false
                    this.$emit('refreshDataList')
                  }
                })
              } else {
                this.$message.error(data.msg)
              }
            })
          }
        })
      }
    }
  }
</script>
